<template>
    <div>
        <div id="char2" style="width: 380px; height: 250px;"></div>
    </div>
</template>

<script setup lang="ts">
import { onMounted } from 'vue';
import { ECharts, EChartsOption, init } from 'echarts';
const props=defineProps({
    data:{
        type:Object,
        default:()=>{}
    }
})
onMounted(() => {
    const {data,type,total} = props.data
    // 表2
    const charEle2 = document.getElementById('char2') as HTMLElement;
    const charEch2: ECharts = init(charEle2);
    const option2: EChartsOption = {
        title: {
            text: total,
            subtext: '医疗器材消耗'
        },
        xAxis: {
            type: 'category',
            boundaryGap: false,
            data: type,
        },
        yAxis: {
            type: 'value'
        },
        series: [
            {
                data:data,
                type: 'line',
                areaStyle: {}
            }
        ]
    };
    charEch2.setOption(option2);
})

</script>

<style scoped>

</style>